import { createRouter, createWebHashHistory } from 'vue-router'
import useStore from '@/store'
import loadMenus from './asyncRoute'

const router = createRouter({
    history: createWebHashHistory(),
    routes: [{
        path: '/',
        component: _ => import('@/views/layout/index.vue'),
        redirect: '/home',
        children: [{
            path: 'home',
            component: _ => import('@/views/home/index.vue')
        }]
        
    }, {
        path: '/login',
        component: _ => import('@/views/login/index.vue')
    }]
})

// 免登录白名单
const white = ['/login']

router.beforeEach(async (to, from, next) => {
    // 如果在白名单-直接放行
    if (white.includes(to.path)) {
        next()
    }
    // 权限页面
    else {
        /**
         * 注意：store 要在这里获取，这里才能获取到最新的
         * 放在外面的话，获取到的永远都是项目首次加载时的数据
         */
        const $store = useStore()
        // 如果没有登录-送回登录页
        if (!$store.token) {
            next('/login')
        }
        // 已经登录-但是没有注册动态路由的情况
        else if ($store.isRegMenu == false) {
            // 在这里获取用户信息，防止页面刷新后store里对应数据丢失
            await $store.getUserInfo()
            // 1.获取路由（菜单）数据
            let r = await $store.getRouterMenu()
            // 2.去注册动态路由
            loadMenus(r)
            // 3.isRegMenu 开关处理
            $store.isRegMenu = true
            /**
             * 4.路由放行
             * 中断当前导航，执行新的路由
             * 避免路由刚添加上去就被访问而出现白屏
             */
            next({...to, replace: true})
        }
        else {
            next()
        }
    }
})

export default router